<template>
	<view class="w-100">
		<template v-if="!loadingState">
			<view class="flex-1 row" style="height: 500px;">
				<image :src="loadingImg" style="width: 100rpx;height: 100rpx;" mode=""></image>
			</view>
		</template>
		<template v-else>
			<view class="flex-1 position-relative">
				<view class="flex-1 row py-5">
					<view class="time-box row" v-for="(item,index) in timeTab" :key="index"
						:class="tabIndex == index ? 'take-time' : ''" @click="clickTime(index)">
						<view class="time-text font-s-2">{{ item.name }}</view>
					</view>
				</view>
				<view class="iconfont icon-ribao-ribao"></view>
			</view>

			<view class="flex-1 bg-f5 py-3 mx-3 px-2">
				<view class="flex-1 py-3">
					<view class="flex-1 row-ac">
						<view class="flex-1 row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">{{ reportstatistics.submit_funds }}</view>
							<view class="font-s-2 mt">待上交</view>
						</view>
						<view class="flex-1 row-a-j-fc" @click="navTo('/pages/datacenter/sales-report-list')">
							<view class="font-s-5 text-main-color font-w">{{ reportstatistics.receiving_funds }}</view>
							<view class="font-s-2 mt">待收款</view>
						</view>
						<view class="flex-1 row-a-j-fc" v-if="useridentity.identity == 4">
							<view class="font-s-5 text-main-color font-w">
								{{ poolreport.wholesaler_amount_sum | num2Filter }}
							</view>
							<view class="font-s-2 mt">批发商分红池</view>
						</view>
					</view>
				</view>
				<view class="flex-1 py-3"
					v-if="useridentity.identity == 5 || useridentity.identity == 7 || useridentity.identity == 8">
					<view class="flex-1 row-ac">
						<view class="flex-1 row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ poolreport.wholesaler_amount_sum | num2Filter }}
							</view>
							<view class="font-s-2 mt">批发商分红池</view>
						</view>
						<view class="flex-1 row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ poolreport.branch_amount_sum | num2Filter }}
							</view>
							<view class="font-s-2 mt">分公司分红池</view>
						</view>
					</view>
				</view>
				<view class="flex-1 py-3">
					<view class="flex-1 row pb-2">收益数据</view>
					<view class="flex-1 row-ac-fw mt-2">
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ personalreport.today_agent_commission_amount + personalreport.today_region_branch_amount + personalreport.today_regional_dividend_amount | num2Filter }}
							</view>
							<view class="font-s-2 mt">今日收入</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ personalreport.today_agent_commission_amount | num2Filter }}
							</view>
							<view class="font-s-2 mt">今日分享佣金</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ personalreport.today_region_branch_amount | num2Filter }}
							</view>
							<view class="font-s-2 mt">今日区域收入</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								{{ personalreport.today_regional_dividend_amount | num2Filter }}
							</view>
							<view class="font-s-2 mt">今日分红收入</view>
						</view>
						<view class="flex-box row-a-j-fc" @click="navTo('/pages/user/operation/dividend-list')">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.region_branch_amount }}
							</view>
							<view class="font-s-2 mt">区域收益</view>
						</view>
						<view class="flex-box row-a-j-fc" @click="navTo('/pages/user/operation/dividend-list')">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.regional_dividend_amount }}
							</view>
							<view class="font-s-2 mt">销售分红</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.personal_profit_amount }}
							</view>
							<view class="font-s-2 mt">累计收益</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.user_submission_amount }}
							</view>
							<view class="font-s-2 mt">累计上交</view>
						</view>
						<view class="flex-box row-a-j-fc" v-if="useridentity.identity == 2">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.agent_commission_amount }}
							</view>
							<view class="font-s-2 mt">分享佣金</view>
						</view>
						<view class="flex-box row-a-j-fc"
							v-if="useridentity.identity !== 2 && useridentity.identity !== 1">
							<view class="font-s-5 text-main-color font-w">{{ personalreport.pay_commission_amount }}
							</view>
							<view class="font-s-2 mt">应付佣金</view>
						</view>
					</view>
				</view>
				<view class="flex-1 py-3">
					<view class="flex-1 row pb-2">预付货款</view>
					<view class="flex-1 row-ac-fw mt-2">
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								46832.80
							</view>
							<view class="font-s-2 mt">已经用货款</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								153167.2
							</view>
							<view class="font-s-2 mt">货款余额</view>
						</view>
						<view class="flex-box row-a-j-fc">
							<view class="font-s-5 text-main-color font-w">
								200000.00
							</view>
							<view class="font-s-2 mt">预付货款总额</view>
						</view>
					</view>
				</view>
			</view>
			<view class="flex-1 mt-4 mx-4">
				<view class="flex-1 py-4 row-ac border-bottom bt-box" @click="navTo('/pages/datacenter/sales-report')">
					<view class="flex-1 row-ac">
						<view class="iconfont icon-xiaoshouyuce" style="color: red;"></view>
						<view class="ml-1">团队销售报表</view>
					</view>
					<view class="iconfont icon-next-01"></view>
				</view>
				<view class="flex-1 py-4 row-ac border-bottom bt-box" @click="navTo('/pages/datacenter/product-report')">
					<view class="flex-1 row-ac">
						<view class="iconfont icon-shouyi1" style="color: #009900;"></view>
						<view class="ml-1">产品销售报表</view>
					</view>
					<view class="iconfont icon-next-01"></view>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	import {
		userInfoUrl,
		usersbalanceUrl,
		useridentityDetailUrl,
		distributorsDetailUrl,
		useridentityexamineListUrl,
		revenuereportListUrl,
		dividendpoolreportUrl,
		revenuereportstatisticsUrl,
		personalreportUrl
	} from '@/api/index.js';
	export default {
		data() {
			return {
				loadingState: false,
				loadingImg: '../../static/img/loading.gif',
				timeTab: [{
						id: 0,
						name: "昨日"
					}, {
						id: 1,
						name: "今日"
					},
					{
						id: 2,
						name: "上月"
					},
					{
						id: 3,
						name: "本月"
					}
				],
				tabIndex: 1,
				navList: [{
						id: 1,
						name: "提单中心",
						icon: "icon-ribao-ribao",
						url: "/pages/datacenter/sales-report-list"
					},
					{
						id: 2,
						name: "自销数据报表",
						icon: "icon-dingdan",
						url: "/pages/datacenter/sales-report"
					},
					{
						id: 3,
						name: "团队销售报表",
						icon: "icon-ribao-ribao",
						url: "/pages/datacenter/sales-report"
					},
					{
						id: 4,
						name: "积分排行榜",
						icon: "icon-tuiguangzhuanqian",
						url: "/pages/user/operation/integral-standings"
					},
					{
						id: 5,
						name: "我的团队",
						icon: "icon-yonghuhaoyou",
						url: "/pages/user/my-team"
					}
				],
				useridentity: '',
				poolQueryInfo: {
					period: 'current'
				},
				poolreport: '',
				reportstatistics: {
					submit_funds: 0,
					receiving_funds: 0
				},
				personalreport: {
					region_branch_amount: 0,
					regional_dividend_amount: 0,
					agent_commission_amount: 0,
					pay_commission_amount: 0,
					user_submission_amount: 0,
					personal_profit_amount: 0,
					today_agent_commission_amount: 0,
					today_region_branch_amount: 0,
					today_regional_dividend_amount: 0
				}
			}
		},
		filters: {
			num2Filter(value) {
				let realVal = parseFloat(value).toFixed(2);
				return realVal;
			}
		},
		onLoad() {
			this.initData()
			this.token = uni.getStorageSync('token')
			setTimeout(() => {
				this.loadingState = true;
			}, 1000);
		},
		onShow() {
			this.initData();
		},
		methods: {
			initData() {
				this.getUseridentityDetail()
				this.getDividendpoolreport()
				this.getRevenuereportstatistics()
				this.getPersonalreport()
			},
			getUseridentityDetail() {
				this.$R.get(useridentityDetailUrl).then(res => {
					this.useridentity = res.data
					console.log('this.useridentity', this.useridentity);
				})
			},
			getDividendpoolreport() {
				this.$R.get(dividendpoolreportUrl, this.poolQueryInfo).then(res => {
					this.poolreport = res.data
				})
			},
			getRevenuereportstatistics() {
				this.$R.get(revenuereportstatisticsUrl).then(res => {
					this.reportstatistics = res.data
				})
			},
			getPersonalreport() {
				this.$R.get(personalreportUrl).then(res => {
					this.personalreport = res.data
				})
			},
			clickTime(index) {
				this.tabIndex = index
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	.bg-f5 {
		background-color: #f5f5f5;
	}

	.time-box {
		width: 120rpx;
		height: 48rpx;
		background-color: #f3f3f3;
	}

	.take-time {
		background-color: #000 !important;
	}

	.take-time .time-text {
		color: #fff;
	}

	.bt-box {
		.iconfont {
			font-size: 46rpx;
		}

		.icon-next-01 {
			font-size: 30rpx;
		}
	}

	.icon-ribao-ribao {
		position: absolute;
		right: 30rpx;
		top: 20rpx;
	}

	.flex-box {
		width: 25%;
		height: 130rpx;
	}
	.flex-box-3 {
		width: 25%;
		height: 130rpx;
	}
</style>